<!-- pages/summary/summary.vue -->
<template>
  <view class="container">
  <button class="back-button" @click="goBack">返回</button>

    <uni-section title="面试详情" type="line">
      <!-- 长文本框容器 -->
      <view class="content-box">
        <template v-if="content">
          <!-- 使用处理后的格式化内容 -->
          <view class="formatted-content">
            <template v-for="(item, index) in formattedContent" :key="index">
              <!-- 标题 -->
              <h4 v-if="item.type === 'title'" class="title-text">{{ item.content }}</h4>
              
              <!-- 普通文本 -->
              <text v-else-if="item.type === 'text'">{{ item.content }}</text>
              
              <!-- 加粗文本 -->
              <text v-else-if="item.type === 'bold'" class="bold-text">{{ item.content }}</text>
              
              <!-- 换行 -->
              <br v-if="item.content.includes('\n')" />
            </template>
          </view>
        </template>
        
        <!-- 加载状态 -->
        <view v-else class="loading-text">加载中...</view>
      </view>
    </uni-section>
  </view>
</template>

<script setup>
import { ref, onMounted } from 'vue';
import { useRoute } from "vue-router"; // 添加这行导入
import { interviewResult } from '@/utils/find';
import { formatContent, processTextWithBold } from '@/utils/formatter';

const route = useRoute();
const interviewId = ref(route.query.interview_id || '');
const content = ref('');
const formattedContent = ref([]);

// 获取面试结果
const fetchInterviewResult = async () => {
  if (!interviewId.value) {
    uni.showToast({ title: '缺少面试ID', icon: 'none' });
    return;
  }

  try {
    const result = await interviewResult(interviewId.value);

    // 提取 contentTotal 内容
    if (result && typeof result.contentTotal === 'string') {
      content.value = result.contentTotal;
    } else {
      content.value = '无可用内容';
    }

    formattedContent.value = formatContent(content.value);
  } catch (error) {
    uni.showToast({ title: '加载失败', icon: 'none' });
    console.error('面试结果加载错误:', error);
  }
};

const goBack = () => {
  uni.reLaunch({
    url: '/pages/index/find',
  });
};

// 页面加载时获取数据
onMounted(() => {
  fetchInterviewResult();
});
</script>

<style scoped>
.content-box {
  min-height: 200px;
  padding: 15px;
  margin-top: 10px;
  background-color: #f9f9f9;
  border: 1px solid #eee;
  border-radius: 6px;
  white-space: pre-wrap;
  font-size: 14px;
  color: #333;
}

.loading-text {
  text-align: center;
  color: #999;
  padding: 20px;
}

/* 复用 overview.vue 的格式化样式 */
.title-text {
  margin-top: 15px;
  font-size: 16px;
  font-weight: bold;
  color: #2c3e50;
}

.bold-text {
  font-weight: bold;
}

.formatted-content {
  line-height: 1.6;
}
</style>